<form class = "ajax-form" action = "{:url('')}" method="post">
    <div class = "form-group row">
        <label class = "col-sm-2 col-xs-12">字典名称</label>
        <div class = "col-sm-10 col-xs-12">
            <input type="text" class = "form-control" name = "name" value="{$vo.name|default=''}" autocomplete="off" placeholder="请填写字典名称"/>
        </div>
    </div>
    <div class = "form-group row">
        <label class = "col-sm-2 col-xs-12">字典标识</label>
        <div class = "col-sm-10 col-xs-12">
            <input type="text" class = "form-control" name = "key" value="{$vo.key|default=''}" autocomplete="off" placeholder="请填写字典标识，请用英文填写"/>
        </div>
    </div>
    <div class = "form-group row">
        <label class = "col-sm-2 col-xs-12">备注</label>
        <div class = "col-sm-10 col-xs-12">
            <textarea name="desc" name="desc" class="form-control">{$vo.desc|default=''}</textarea>
        </div>
    </div>
    <div class = "form-group row">
        <table class = "table">
            <thead>
            <tr>
                <th>字典键</th>
                <th>字典值</th>
                <th><i class = "fa fa-plus" onclick="newTr(this)" data-index="{if condition='isset($set)'}{:count($set)}{else}0{/if}"></i></th>
            </tr>

            </thead>
            <tbody id = "fields">
                {if condition="isset($set)"}
                {volist name="set" id="item" key="key"}
                <tr>
                    <td><input type="text" name = "set[{$key}][dict_key]" value="{$item.dict_key|default=''}" class = "form-control" autocomplete="off"/></td>
                    <td><input type="text" name = "set[{$key}][dict_value]" value="{$item.dict_value|default=''}" class = "form-control" autocomplete="off"/></td>
                    <td><i class = "fa fa-close" onclick="del(this)"></i></td>
                </tr>
                {/volist}
                {/if}
            </tbody>
        </table>

    </div>
    <div class = "form-group user-btn-group">
        {if isset($vo['id'])}<input type='hidden' value='{$vo.id}' name='id'>{/if}
        <button class="btn btn-success" type='submit'>保存</button>
        <button class="btn btn-warning" type='button' data-confirm="确定要取消数据保存吗？" data-dismiss="modal">取消</button>
    </div>
    <script>
        function newTr(e) {
            let index = $(e).attr('data-index')
            $("#fields").append(`
                <tr>
                    <td><input type="text" name = "set[${index}][dict_key]" class = "form-control" autocomplete="off"/></td>
                    <td><input type="text" name = "set[${index}][dict_value]"  class = "form-control" autocomplete="off"/></td>
                    <td><i class = "fa fa-close" onclick="del(this)"></i></td>
                </tr>
            `);
            index = parseInt(index) + 1
            $(e).attr('data-index', index)
        }
        function del(e) {
            $(e).parent().parent().remove()
        }

    </script>
</form>